<template>
  <div class="edit-plan-view">

    <el-form ref="form" :inline="true" :model="data" :rules="rules" class="demo-form-inline" label-width="100px" size="medium" label-position="left">
      <el-form-item label="任务名称" prop="task_name">
        <el-input v-model="data.task_name" v-if="data.is_add" placeholder="请输入任务名称" clearable></el-input>
        <span v-else>{{data.task_name}}</span>
      </el-form-item>
      <el-form-item label="父任务" v-if="data.level != 1">
        <el-select v-model="data.parent_id" @change="planChange" v-if="data.is_add" placeholder="请选择父任务">
          <el-option
            v-for="item in planList"
            :key="item.id"
            :label="item.task_name"
            :value="item.id">
          </el-option>
        </el-select>

        <span v-else>{{data.parent_name}}</span>
      </el-form-item>
      <el-form-item label="前置任务" v-if="data.level != 1">
        <el-select v-model="data.foreground_task_id" @change="preChange" placeholder="请选择前置任务" v-if="data.is_add" clearable>
          <el-option
            v-for="item in planList2"
            :key="item.id"
            :label="item.task_name"
            :value="item.id">
          </el-option>
        </el-select>
        <span v-else>{{data.foreground_task_name?data.foreground_task_name:'无'}}</span>
      </el-form-item>
      <el-form-item label="计划开始时间" >
        <el-date-picker
          @change="startchange"
          v-model="data.startDate"
          type="date"
          :editable="false"
          :clearable="false"
          placeholder="选择开始时间"
          :picker-options="pickerOptions">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="计划结束时间">
        <el-date-picker
          @change="endchange"
          v-model="data.endDate"
          type="date"
          :editable="false"
          :clearable="false"
          placeholder="选择结束时间"
          :picker-options="pickerOptions2">
        </el-date-picker>
      </el-form-item>

      <el-form-item label="工期（天）">
        <el-input v-model="data.duration" @keyup.native="durationProving" @blur="blur"></el-input>
      </el-form-item>
      <el-form-item label="任务负责人">
        <el-select v-model="data.person_id" placeholder="请选择任务负责人" @change="personChange" clearable>
          <el-option
            v-for="item in members"
            :key="item.member_id"
            :label="item.member_name"
            :value="item.member_id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="任务参与人">
        <el-select
          v-model="data.task_member_id"
          @change="memberChange"
          multiple
          collapse-tags
          placeholder="请选择任务参与人">
          <el-option
            v-for="item in members"
            :key="item.member_id"
            :label="item.member_name"
            :value="item.member_id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="阶段性评审" prop="delivery">
        <el-switch v-model="data.periodical_review" v-if="data.is_add"></el-switch>
        <span v-else>{{data.periodical_review?'是':'否'}}</span>
      </el-form-item>
      <el-form-item label="强制验收" prop="delivery">
        <el-switch v-model="data.mandatory_check" v-if="data.is_add"></el-switch>
        <span v-else>{{data.mandatory_check?'是':'否'}}</span>
      </el-form-item>

    </el-form>

    <div class="document-view">

      <div class="top">

        <p class="title">交付文档</p>

        <div class="btn-view">

<!--          <a class="add" icon="el-icon-edit" @click="addClick">添加文档</a>-->
          <el-button size="medium" type="text" icon="el-icon-edit" @click="addClick">
            添加文档
          </el-button>
<!--          <a class="dlt" @click="allDelete">全部删除</a>-->

        </div>

      </div>

      <el-table
        size="medium"
        :data="data.files"
        border
        style="width: 100%">
        <el-table-column
          align="center"
          prop="file_name"
          label="文档名称"
          width="200">
        </el-table-column>
        <el-table-column
          align="center"
          prop="type_name"
          label="文档类型"
          width="100">
        </el-table-column>
        <el-table-column
          align="center"
          label="申报所需文件"
          width="150">
          <template slot-scope="scope">
            <span>{{scope.row.need?'是':'否'}}</span>
          </template>
        </el-table-column>
        <el-table-column
          align="center"
          prop="name"
          label="操作">
          <template slot-scope="scope">

            <el-button size="medium" type="text" icon="el-icon-edit"  v-if="scope.row.is_add" @click="editClick(scope.row,scope.$index)">
              编辑
            </el-button>
            <el-button class="text-btn-red" size="medium" type="text" icon="el-icon-delete" v-if="scope.row.is_add" @click="deleteClick(scope.$index)">
              删除
            </el-button>
          </template>

        </el-table-column>
      </el-table>

    </div>

    <document-edit ref="documentEdit" :datas="documentData" :plans="plans" is-task @succeed="documentSucceed"></document-edit>

  </div>
</template>

<script>
  import documentEdit from "./documentEdit";
    export default {
        name: "editPlanView",
        components:{documentEdit},
        props:{
            data:Object,
            documents:{
                type:Object,
                default:function () {
                    return{
                        list:[],
                        id:0,
                    }
                }
            },
            plans:{
                type:Array,
                default:function () {
                    return[]
                }
            },
            members:Array,
        },
        data: function() {
            return {
                tableData:[],
                documentData:{},
                documentIndex:-1,
                planList:[],
                planList2:[],
                pickerOptions: {
                    disabledDate:time=> {
                        if (this.data.firstPlan && this.data.limitStart){
                            return time.getTime() < new Date(this.data.limitStart.replace(/-/g,'/')).getTime();
                        }else{
                            return time.getTime() < new Date().getTime();
                        }

                    }
                },
                pickerOptions2: {
                    disabledDate:time=> {
                        if (this.data.startDate != ''){
                            if (time.toLocaleDateString() == new Date(this.data.startDate.replace(/-/g,'/')).toLocaleDateString()){
                                return false
                            }
                            return time.getTime() < new Date(this.data.startDate.replace(/-/g,'/')).getTime();
                        }else{
                            return time.getTime() < new Date().getTime();
                        }

                    }
                },
                options: [],
                rules: {
                    task_name: [
                        { required: true, message: '请输入名称', trigger: 'blur' }
                    ],
                },
            }
        },
        mounted:function(){
            this.options = this.$store.getters.sysDic('file_type')
        },
        methods:{
            startchange:function(time){

                if (this.data.startDate != ''){
                    this.data.startDate = this.dealDateStr(this.data.startDate)  + " 00:00:00"
                    this.data.start_date = this.data.startDate

                }
                if (this.data.duration){
                    this.data.endDate = this.dealDate(this.data.startDate,this.data.duration) + " 23:59:59"
                    this.data.end_date = this.data.endDate
                }else if (this.data.endDate){
                    let  startDate = Date.parse(this.data.startDate);
                    let  endDate = Date.parse(this.data.endDate);
                    if (startDate>endDate){
                        this.data.duration = 0;
                        this.data.endDate = ""
                        this.data.end_date = ""
                    }else if (startDate==endDate){
                        this.data.duration = 1
                    }else{
                        let num = ((endDate - startDate)/(1*24*60*60*1000)).toFixed(0)
                        this.data.duration = Number(num);
                    }
                }

            },
            endchange:function(){
                if (this.data.endDate){
                    this.data.endDate = this.dealDateStr(this.data.endDate)  + " 23:59:59"
                    this.data.end_date = this.data.endDate

                    if (this.data.startDate){
                        let  startDate = Date.parse(this.data.startDate);
                        let  endDate = Date.parse(this.data.endDate);
                        if (startDate>endDate){
                            this.data.duration = 0;
                            this.data.endDate = ""
                            this.data.end_date = ""
                        }else if (startDate==endDate){
                            this.data.duration = 1
                        }else{
                            let num = ((endDate - startDate)/(1*24*60*60*1000)).toFixed(0)
                            this.data.duration = Number(num);
                        }
                    }else if (this.data.duration){
                        let a = this.dealStartDate(this.data.endDate,this.data.duration)  + " 00:00:00"
                        let date = new Date(a.replace(/-/g,'/'))
                        if (date.getTime() < new Date().getTime() && date.toLocaleDateString() != new Date().toLocaleDateString()){
                            return
                        }
                        this.data.startDate = a
                        this.data.start_date = this.data.startDate
                    }

                }
            },
            blur:function(){
                if (this.data.startDate){
                    this.data.endDate = this.dealDate(this.data.startDate,this.data.duration) + " 23:59:59"
                    this.data.end_date = this.data.endDate
                }else if (this.data.endDate){
                    let a = this.dealStartDate(this.data.endDate,this.data.duration)  + " 00:00:00"
                    let date = new Date(a.replace(/-/g,'/'))
                    if (date.getTime() < new Date().getTime() && date.toLocaleDateString() != new Date().toLocaleDateString()){
                        return
                    }
                    this.data.startDate = a
                    this.data.start_date = this.data.startDate
                }

            },
            dealStartDate:function(str,days){
                let date = new Date(str.replace(/-/g,'/'));
                if (days > 0){
                    days = days-1
                }
                let timeStr = Number(days) * 24 * 3600;
                if (date.getTime() > 99999999999){
                    timeStr = timeStr * 1000;
                }

                let dd = date.getTime() - timeStr

                let date2 = new Date(dd)

                return this.dealDateStr(date2)
            },
            dealDate:function(str,days){
                let date = new Date(str);
                if (days > 0){
                    days = days-1
                }
                let timeStr = Number(days) * 24 * 3600;
                if (date.getTime() > 99999999999){
                    timeStr = timeStr * 1000;
                }

                let dd = date.getTime() + timeStr

                let date2 = new Date(dd)

                return this.dealDateStr(date2)
            },
            dealDateStr:function(date){
                let year = date.getFullYear();
                let month = date.getMonth() + 1;
                let day = date.getDate();
                if (month < 10){
                    month = "0" + month
                }
                if (day < 10){
                    day = "0" + day;
                }

                return year + "-" + month + "-" + day
            },
            dealDate2:function(str,days){
                let date = new Date(str);

                let timeStr = Number(days) * 24 * 3600;
                if (date.getTime() > 99999999999){
                    timeStr = timeStr * 1000;
                }

                let dd = date.getTime() - timeStr

                let date2 = new Date(dd)

                let year = date2.getFullYear();
                let month = date2.getMonth() + 1;
                let day = date2.getDate();
                if (month < 10){
                    month = "0" + month
                }
                if (day < 10){
                    day = "0" + day;
                }

                return year + "-" + month + "-" + day
            },
            dealPlanList:function(list = null){
                this.planList = [];

                this.plans.forEach(item=>{
                    if (item.id != this.data.id && item.level != 5){
                        this.planList.push(item);
                    }
                })

                this.ids = [];
                if (list){
                    this.ids = this.ids.concat(list)
                }
                if (this.data.children && this.data.children.length > 0){
                    this.aaa(this.data.children);
                }

                this.planList2 = [];
                this.plans.forEach(item=>{
                    let index = this.ids.findIndex(a=>a == item.id)
                    if (item.id != this.data.id && index == -1){
                        this.planList2.push(item);
                    }
                })
            },
            aaa:function(list){
                for (let i = 0; i < list.length; i++){
                    if (list[i].children && list[i].children.length > 0){
                        this.aaa(list[i].children);
                    }
                    this.ids.push(list[i].id);
                }
            },
            allDelete:function(){
                this.data.files = [];
            },
            addClick:function () {
                this.documentData = {
                    id:0,
                    file_name:'',
                    file_type:'',
                    type_name:'',
                    need:false,
                    is_add:true,
                }
                this.documentIndex = -1;

                if (this.$refs.documentEdit){
                    this.$refs.documentEdit.openDialog()
                }
            },
            documentSucceed:function(){
                let data = {...this.documentData};

                if (this.documentIndex < 0){
                    data.id = this.documents.id + "";
                    this.documents.id ++;
                    this.data.files.push(data)
                }else {
                    this.$set(this.data.files,this.documentIndex,data);
                }
            },
            editClick:function (item,index) {
                this.documentData = {...item}
                this.documentIndex = index;

                if (this.$refs.documentEdit){
                    this.$refs.documentEdit.openDialog()
                }
            },
            deleteClick:function (index) {
                this.data.files.splice(index,1)
            },
            planChange:function (id) {
                let index = this.planList.findIndex(a=>a.id == id)
                if (index != -1){
                    let plan = this.planList[index]
                    this.data.parent_id = plan.id + "";
                    this.data.parent_name = plan.task_name;

                    this.data.foreground_task_id = "";
                    this.data.foreground_task_name = "";

                    let list = this.getParent(this.data)

                    this.planList2 = [];
                    this.plans.forEach(item=>{
                        let index = list.findIndex(a=>a == item.id)
                        if (item.id != this.data.id && index == -1){
                            this.planList2.push(item);
                        }
                    })
                }
            },
            getParent:function(data){
                let list = []
                if (data.parent_id){
                    let index = this.planList.findIndex(a=>a.id == data.parent_id)
                    if (index != -1){
                        let plan = this.planList[index]
                        list.push(plan.id)
                        list = list.concat(this.getParent(plan))
                    }
                }
                return list;
            },
            preChange:function (id) {
                if (id){
                    let index = this.planList2.findIndex(a=>a.id == id)
                    if (index != -1){
                        let plan = this.planList2[index]
                        this.data.foreground_task_id = plan.id + "";
                        this.data.foreground_task_name = plan.task_name;
                    }
                }else{
                    this.data.foreground_task_id = "";
                    this.data.foreground_task_name = ""
                }

            },
            durationProving:function(val) {
                let str = this.data.duration
                // this.form.skus[e].Price 是input的值　　
                // 先把非数字的都替换掉，除了数字和.
                str = str.replace(/[^\d]/g, '');

                this.data.duration = Number(str);

            },
            personChange:function (id) {
                if (id){
                    let index = this.members.findIndex(a=>a.member_id == id)
                    if (index != -1){
                        let data = this.members[index];
                        this.data.person_id = data.member_id
                        if (this.data.person_in_charge){
                            if (this.data.task_member){
                                let index1 = this.data.task_member.findIndex(a=>a.member_id == this.data.person_in_charge.member_id)
                                if (index1 != -1){
                                    this.data.task_member.splice(index1,1)
                                }
                            }
                            if (this.data.task_member_id){
                                let index1 = this.data.task_member_id.findIndex(a=>a == this.data.person_in_charge.member_id)
                                if (index1 != -1){
                                    this.data.task_member_id.splice(index1,1)
                                }
                            }
                        }
                        this.data.person_in_charge = data

                        if (!this.data.task_member){
                            this.data.task_member_id = [id]
                            this.data.task_member = [data]
                        }else{
                            let index1 = this.data.task_member.findIndex(a=>a.member_id == id)
                            if (index1 == -1){
                                this.data.task_member_id.push(id)
                                this.data.task_member.push(data)
                            }
                        }
                    }
                }else{
                    this.data.person_in_charge = {}
                }


            },
            memberChange:function (mem) {
                this.data.task_member = [];
                this.data.task_member_id.forEach(id=>{
                    let index = this.members.findIndex(a=>a.member_id == id)
                    if (index != -1){
                        this.data.task_member.push(this.members[index])
                    }
                })
            },
            validateForm:function () {
                return this.$refs.form.validate()
            }
        }
    }
</script>

<style lang="scss">
  @import "../../../../../assets/scss/views/setting/model/editPlanView.scss";
</style>
